/*
 * 编辑设备账号信息
 * @Author: ljb
 * @Date: 2018-03-27 17:53:27
 * @Last Modified by: kanglin
 * @Last Modified time: 2018-08-06 18:01:25
 */
<style lang="less" rel="stylesheet/less" type="text/less" scoped>


</style>
<template>
	<div class="v-store-device-account-edit">
		<Form
			ref="formValidate"
			:model="formValidate"
			:label-width="labelWidth(80,110)"
			name="edit__form">

			<Form-item
				:label="$t('device.account')"
				prop="account">
				<i-input
					v-model="formValidate.account"
					:placeholder="$t('device.please_enter_account')"
					name="edit__account"
					type="text"/>
			</Form-item>

			<Form-item
				:label="$t('device.password')"
				prop="password">
				<i-input
					v-model="formValidate.password"
					:placeholder="$t('device.please_enter_password')"
					name="edit__password"
					type="password"/>
			</Form-item>

			<Form-item
				:label="$t('device.device_name')"
				prop="device_name">
				<i-input
					v-model="formValidate.device_name"
					:placeholder="$t('device.please_enter_device_name')"
					name="edit__device_name"
					type="text"/>
			</Form-item>

			<Form-item>
				<Button
					type="primary"
					name="edit__submit"
					@click="updateAccount">
					{{ $t('common.update') }}
				</Button>
			</Form-item>

		</Form>
	</div>
</template>

<script>
import labelWidthMixin from 'src/views/mixins/labelWidthMixin';

export default {
	name: 'DeviceAccountEdit',
	mixins: [labelWidthMixin],
	props: {
		deviceAccountDetail: {
			type: Object,
			default() {
				return {};
			},
		},
		showModal: {
			type: Boolean,
			default() {
				return false;
			},
		},
	},
	data() {
		return {
			formValidate: {
				account: '',

				password: '',

				store_id: '',

				device_name: '',
			}, // 更新账号时的表单
		};
	},
	watch: {
		deviceAccountDetail() {
			if (this.deviceAccountDetail) {
				this.formValidate.account = this.deviceAccountDetail.account;

				this.formValidate.store_id = String(this.deviceAccountDetail.store_id);

				this.formValidate.device_name = this.deviceAccountDetail.device_name;
			}
		},

		showModal() {
			if (!this.showModal) {
				this.formValidate.password = '';
			}
		},


	},
	methods: {
		/**
         * 更新设备账号
         * @return {undefined}
         */
		updateAccount() {
			const param = {

				_method: 'PUT',

				account: this.formValidate.account,

				store_id: this.formValidate.store_id,

				password: this.formValidate.password,

				device_name: this.formValidate.device_name,

			};

			this.$emit('update', this.deviceAccountDetail.id, param);
		},

	},
};
</script>
